<template>
	<div id="nav">
		<div class="top_index">
			<TopHeand></TopHeand>
		</div>
		<div class="min_index">
			<div class="left_index">
				<MenuView></MenuView>
			</div>
			<div class="right_index">
				<MicroAppViwe />
			</div>
		</div>
	</div>
	
</template>
<script setup>
	import MicroAppViwe from '@/components/MicroAppViwe.vue'
	import MenuView from '@/components/MenuView.vue'
	import TopHeand from '@/components/TopHeand.vue'
</script>
<style scoped>
	.top_index{
		text-align: center;
		padding: 8px 0;
		border-bottom: 1px solid var(--el-menu-border-color);
		width: 100%;
	}
	.min_index{
		display: flex;
		height: calc(100% - 41px);
		width: 100%;
	}
	.left_index{
		width: 250px;
		border-right: 1px solid var(--el-menu-border-color);
	}
	.right_index{
		flex: 1;
	}
	#nav{
		height: 100%;
		/* display: flex;
		flex-wrap: wrap; */
		overflow: hidden;
	}
</style>
